$(function () {
  let colors = ['#0df1de', '#2fe6fc', '#6291f2', '#2861d6', '#0a29be', '#400dc0', '#791c97', '#d0630a', '#f2ec3b', '#25c379']

  function myChart2_1_1() {
    var myChart = echarts.init(document.getElementById('chart2-1-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 450,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10,
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc',
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(47,230,252)'
              },
                {
                  offset: 1,
                  color: 'rgb(40,97,214)'
                }], false),
            }
          },
          data: [
            280, 330, 350, 420, 440
          ],
        },
        {
          name: '增长率',
          type: 'line',
          data: [
            5, 11, 10, 18, 6
          ],
          yAxisIndex: 1,
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_1_2() {
    var myChart = echarts.init(document.getElementById('chart2-1-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 450,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(47,230,252)'
              },
                {
                  offset: 1,
                  color: 'rgb(40,97,214)'
                }], false),
            }
          },
          data: [
            290, 320, 250, 420, 400
          ],
        },
        {
          name: '增长率',
          type: 'line',
          data: [
            5, 15, 4, 18, 14
          ],
          yAxisIndex: 1,
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_1_3() {
    var myChart = echarts.init(document.getElementById('chart2-1-3'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 450,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: 'rgb(47,230,252)'
              },
                {
                  offset: 1,
                  color: 'rgb(40,97,214)'
                }], false),
            }
          },
          data: [
            380, 260, 350, 420, 440
          ],
        },
        {
          name: '增长率',
          type: 'line',
          data: [
            11, 6, 10, 18, 12
          ],
          yAxisIndex: 1,
          symbol: 'none',
          smooth: true,
          symbolSize: 5,
          showSymbol: false,
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_2_1() {
    var myChart = echarts.init(document.getElementById('chart2-2-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 900,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        // {
        //   // nameLocation: 'start',
        //   max: 18,
        //   min: 2,
        //   splitNumber: 9,
        //   type: 'value',
        //   axisLine: {
        //     lineStyle: {
        //       color: 'rgba(255,255,255,.3)'
        //     }
        //   },
        //   axisLabel: {
        //     formatter: '{value}% ',
        //     color: '#ccc'
        //   },
        //   splitLine: {
        //     show: false,
        //   },
        //   axisTick: {
        //     show: false
        //   }
        // }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //     barWidth: 12,
        //     itemStyle: {
        //         normal: {
        //             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //                 offset: 0,
        //               color: 'rgb(98,145,242)'
        //             },
        //               {
        //                 offset: 1,
        //                 color: 'rgb(10,41,190)'
        //             }], false),
        //         }
        //     },
        //     data: [
        //         600, 720, 700, 890, 780
        //     ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            600, 720, 700, 890, 780
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_2_2() {
    var myChart = echarts.init(document.getElementById('chart2-2-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 900,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        // {
        //   // nameLocation: 'start',
        //   max: 18,
        //   min: 2,
        //   splitNumber: 9,
        //   type: 'value',
        //   axisLine: {
        //     lineStyle: {
        //       color: 'rgba(255,255,255,.3)'
        //     }
        //   },
        //   axisLabel: {
        //     formatter: '{value}% ',
        //     color: '#ccc'
        //   },
        //   splitLine: {
        //     show: false,
        //   },
        //   axisTick: {
        //     show: false
        //   }
        // }
      ],
      series: [
        // {
        //   name: '收入',
        //   type: 'bar',
        //   barWidth: 20,
        //   itemStyle: {
        //     normal: {
        //       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         color: '#FFC21F' // 0% 处的颜色
        //       }, {
        //         offset: 1,
        //         color: '#FF5D1F' // 100% 处的颜色
        //       }], false),
        //     }
        //   },
        //   data: [
        //     700, 620, 800, 890, 780
        //   ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            700, 620, 800, 890, 780
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_2_3() {
    var myChart = echarts.init(document.getElementById('chart2-2-3'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 900,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        // {
        //   // nameLocation: 'start',
        //   max: 18,
        //   min: 2,
        //   splitNumber: 9,
        //   type: 'value',
        //   axisLine: {
        //     lineStyle: {
        //       color: 'rgba(255,255,255,.3)'
        //     }
        //   },
        //   axisLabel: {
        //     formatter: '{value}% ',
        //     color: '#ccc'
        //   },
        //   splitLine: {
        //     show: false,
        //   },
        //   axisTick: {
        //     show: false
        //   }
        // }
      ],
      series: [
        // {
        //   name: '收入',
        //   type: 'bar',
        //   barWidth: 20,
        //   itemStyle: {
        //     normal: {
        //       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         color: '#FFC21F' // 0% 处的颜色
        //       }, {
        //         offset: 1,
        //         color: '#FF5D1F' // 100% 处的颜色
        //       }], false),
        //     }
        //   },
        //   data: [
        //     600, 520, 650, 890, 730
        //   ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            600, 520, 650, 890, 730
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_3() {
    var myChart = echarts.init(document.getElementById('chart2-3'));
    var data = {
      dataAge: [{
        name: '火车',
        value: '26'
      }, {
        name: '飞机',
        value: '20'
      }, {
        name: '大巴',
        value: '18'
      }, {
        name: '自驾',
        value: '36'
      }]
    };
    option = {
      title: {
        subtext: '出行方式',
        x: 'center',
        y: '40%',
        textStyle: {
          fontSize: 18,
          fontWeight: 'bold',
          color: ['#EF6000']
        },
        subtextStyle: {
          color: '#fff',
          fontSize: 12,
          textAlign: 'center'
        },

      },
      tooltip: {
        trigger: 'item',
        formatter: (params) => {
          // console.log(params)
          return '出行方式' + '<br/>' + params.marker + params.data.name + ':' + params.data.value + '%'
        }
      },
      color: colors,
      series: [
        {
          type: 'pie',
          radius: ['35', '60'],
          labelLine: {
            normal: {
              length: 20,
              length2: 80,
              lineStyle: {
                type: 'solid'
              }
            }

          },
          label: {
            normal: {
              formatter: (params) => {
                // console.log(params);
                return '{b| ' + params.name + '}' + '\xa0\xa0' + '{c|' + params.percent.toFixed(0) + '%}'
              },
              borderWidth: 0,
              borderRadius: 4,
              padding: [0, -80],
              height: 40,
              fontSize: 12,
              align: 'center',
              color: '#3494BD',
              rich: {
                b: {
                  fontSize: 12,
                  lineHeight: 20,
                  color: '#fff',
                },
                c: {
                  fontSize: 12,
                  lineHeight: 20,
                  color: '#0df1de'
                }

              }
            }
          },
          data: data.dataAge,
        },

      ]
    };
    myChart.setOption(option);

  }
  // 右侧
  function myChart2_4_1() {
    var myChart = echarts.init(document.getElementById('chart2-4-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 180,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10,
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc',
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                offset: 0,
                color: 'rgb(98,145,242)'
              },
                {
                  offset: 1,
                  color: 'rgb(10,41,190)'
                }], false),
            }
          },
          data: [
            100, 130, 150, 170, 160
          ],
        },
        {
          name: '增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            5, 11, 10, 18, 6
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_4_2() {
    var myChart = echarts.init(document.getElementById('chart2-4-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 180,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                offset: 0,
                color: 'rgb(98,145,242)'
              },
                {
                  offset: 1,
                  color: 'rgb(10,41,190)'
                }], false),
            }
          },
          data: [
            120, 178, 150, 140, 100
          ],
        },
        {
          name: '增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            5, 15, 4, 15, 4
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_4_3() {
    var myChart = echarts.init(document.getElementById('chart2-4-3'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['客流量', '增长率'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(万人)',
          type: 'value',
          max: 180,
          splitNumber: 10,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 25,
          min: -15,
          splitNumber: 10,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        {
          name: '客流量',
          type: 'bar',
          barWidth: 12,
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                offset: 0,
                color: 'rgb(98,145,242)'
              },
                {
                  offset: 1,
                  color: 'rgb(10,41,190)'
                }], false),
            }
          },
          data: [
            120, 160, 170, 120, 140
          ],
        },
        {
          name: '增长率',
          type: 'line',
          yAxisIndex: 1,
          data: [
            6, 14, 16, 10, 12
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.5,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,0.50196)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_5_1() {
    var myChart = echarts.init(document.getElementById('chart2-5-1'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 180,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 18,
          min: 2,
          splitNumber: 9,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //   barWidth:12,
        //   itemStyle: {
        //     normal: {
        //       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         offset: 0,
        //         color: 'rgb(98,145,242)'
        //       },
        //         {
        //           offset: 1,
        //           color: 'rgb(10,41,190)'
        //         }], false),
        //     }
        //   },
        //     data: [
        //         110, 120, 160, 170, 130
        //     ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            110, 120, 160, 170, 130
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,1)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_5_2() {
    var myChart = echarts.init(document.getElementById('chart2-5-2'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 180,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 18,
          min: 2,
          splitNumber: 9,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //   barWidth:12,
        //   itemStyle: {
        //     normal: {
        //       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         offset: 0,
        //         color: 'rgb(98,145,242)'
        //       },
        //         {
        //           offset: 1,
        //           color: 'rgb(10,41,190)'
        //         }], false),
        //     }
        //   },
        //     data: [
        //         110, 120, 160, 170, 130
        //     ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            160, 170,110, 120,  130
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,1)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_5_3() {
    var myChart = echarts.init(document.getElementById('chart2-5-3'));
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'none',
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        }
      },
      grid: {
        left: '12%',
        top: '20%',
        bottom: '15%',
        right: '12%',
      },
      legend: {
        data: ['收入', 'GDP占比'],
        top: '0',
        right: '0',
        itemWidth: 20,
        itemHeight: 10,
        textStyle: {
          fontSize: '12',
          color: '#fff'
        }
      },
      xAxis: [
        {
          type: 'category',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#ccc'
          },
          axisTick: {
            show: false
          },
          data: [
            '2015', '2016', '2017', '2018', '2019'
          ]
        }
      ],
      yAxis: [

        {
          name: '(亿元)',
          type: 'value',
          max: 180,
          splitNumber: 9,
          nameTextStyle: {
            color: "#fff",
            fontSize: 10
          },
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        },
        {
          // nameLocation: 'start',
          max: 18,
          min: 2,
          splitNumber: 9,
          type: 'value',
          axisLine: {
            lineStyle: {
              color: 'rgba(255,255,255,.3)'
            }
          },
          axisLabel: {
            formatter: '{value}% ',
            color: '#ccc'
          },
          splitLine: {
            show: false,
          },
          axisTick: {
            show: false
          }
        }
      ],
      series: [
        // {
        //     name: '收入',
        //     type: 'bar',
        //   barWidth:12,
        //   itemStyle: {
        //     normal: {
        //       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        //         offset: 0,
        //         offset: 0,
        //         color: 'rgb(98,145,242)'
        //       },
        //         {
        //           offset: 1,
        //           color: 'rgb(10,41,190)'
        //         }], false),
        //     }
        //   },
        //     data: [
        //         110, 120, 160, 170, 130
        //     ],
        // },
        {
          name: 'GDP占比',
          type: 'line',
          // yAxisIndex: 1,
          data: [
            130, 110, 120, 157, 130
          ],
          smooth: true, //平滑曲线显示
          showAllSymbol: true, //显示所有图形。
          symbol: "none", //标记的图形为实心圆
          symbolSize: 6, //标记的大小
          areaStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                offset: 0,
                color: ' rgba(13,241,222,0.50196)'
              }, {
                offset: 0.3,
                color: 'rgba(13,241,222,0.10196)'
              }, {
                offset: 1,
                color: 'rgba(13,241,222,0)'
              }], false),
            },
          },
          itemStyle: {
            color: "rgba(13,241,222,1)"
          },
        }
      ]
    };
    myChart.setOption(option);

  }

  function myChart2_6() {
    var myChart = echarts.init(document.getElementById('chart2-6'));
    var data = {
      dataAge: [{
        name: '景区',
        value: '22'
      }, {
        name: '旅行社',
        value: '19'
      }, {
        name: '酒店',
        value: '14'
      }, {
        name: '购物',
        value: '10'
      }, {
        name: '娱乐',
        value: '16'
      }, {
        name: '餐饮',
        value: '19'
      }]
    };
    option = {
      title: {
        text: '8972',
        subtext: '累计消费',
        x: 'center',
        y: '38%',
        textStyle: {
          fontSize: 18,
          fontWeight: 'bold',
          color: ['#EF6000']
        },
        subtextStyle: {
          color: '#fff',
          fontSize: 12,
          textAlign: 'center'
        },

      },
      tooltip: {
        trigger: 'item',
        formatter: (params) => {
          console.log(params)
          return '出行方式' + '<br/>' + params.marker + params.data.name + ':' + params.data.value + '%'
        }
      },
      color: colors,
      series: [
        {
          type: 'pie',
          radius: ['35', '60'],
          labelLine: {
            normal: {
              length: 20,
              length2: 80,
              lineStyle: {
                type: 'solid'
              }
            }

          },
          label: {
            normal: {
              formatter: (params) => {
                // console.log(params);
                return '{b| ' + params.name + '}' + '\xa0\xa0' + '{c|' + params.percent.toFixed(0) + '%}'
              },
              borderWidth: 0,
              borderRadius: 4,
              padding: [0, -80],
              height: 40,
              fontSize: 12,
              align: 'center',
              color: '#3494BD',
              rich: {
                b: {
                  fontSize: 12,
                  lineHeight: 20,
                  color: '#fff',
                },
                c: {
                  fontSize: 12,
                  lineHeight: 20,
                  color: '#0df1de'
                }

              }
            }
          },
          data: data.dataAge,
        },

      ]
    };
    myChart.setOption(option);

  }

  // 中间
  function myChart2_7() {
    var myChart = echarts.init(document.getElementById('chart2-7'));
    var chinaGeoCoordMap = {
      '黑龙江': [127.9688, 45.368],
      '内蒙古': [110.3467, 41.4899],
      "吉林": [125.8154, 44.2584],
      '北京市': [116.4551, 40.2539],
      "辽宁": [123.1238, 42.1216],
      "河北": [114.4995, 38.1006],
      "天津": [117.4219, 39.4189],
      "山西": [112.3352, 37.9413],
      "陕西": [109.1162, 34.2004],
      "甘肃": [103.5901, 36.3043],
      "宁夏": [106.3586, 38.1775],
      "青海": [101.4038, 36.8207],
      "新疆": [87.9236, 43.5883],
      "西藏": [91.11, 29.97],
      "四川": [103.9526, 30.7617],
      "重庆": [108.384366, 30.439702],
      "山东": [117.1582, 36.8701],
      "河南": [113.4668, 34.6234],
      "江苏": [118.8062, 31.9208],
      "安徽": [117.29, 32.0581],
      "湖北": [114.3896, 30.6628],
      "浙江": [119.5313, 29.8773],
      "福建": [119.4543, 25.9222],
      "江西": [116.0046, 28.6633],
      "湖南": [113.0823, 28.2568],
      "贵州": [106.6992, 26.7682],
      "云南": [102.9199, 25.4663],
      "广东": [113.12244, 23.009505],
      "广西": [108.479, 23.1152],
      "海南": [110.3893, 19.8516],
      '上海': [121.4648, 31.2891]
    };
    var chinaDatas = [
      [{
        name: '黑龙江',
        value: 0
      }], [{
        name: '内蒙古',
        value: 0
      }], [{
        name: '吉林',
        value: 0
      }], [{
        name: '辽宁',
        value: 0
      }], [{
        name: '河北',
        value: 0
      }], [{
        name: '天津',
        value: 0
      }], [{
        name: '山西',
        value: 0
      }], [{
        name: '陕西',
        value: 0
      }], [{
        name: '甘肃',
        value: 0
      }], [{
        name: '宁夏',
        value: 0
      }], [{
        name: '青海',
        value: 0
      }], [{
        name: '新疆',
        value: 0
      }], [{
        name: '西藏',
        value: 0
      }], [{
        name: '四川',
        value: 0
      }], [{
        name: '重庆',
        value: 0
      }], [{
        name: '山东',
        value: 0
      }], [{
        name: '河南',
        value: 0
      }], [{
        name: '江苏',
        value: 0
      }], [{
        name: '安徽',
        value: 0
      }], [{
        name: '湖北',
        value: 0
      }], [{
        name: '浙江',
        value: 0
      }], [{
        name: '福建',
        value: 0
      }], [{
        name: '江西',
        value: 0
      }], [{
        name: '湖南',
        value: 0
      }], [{
        name: '贵州',
        value: 0
      }], [{
        name: '广西',
        value: 0
      }], [{
        name: '海南',
        value: 0
      }], [{
        name: '上海',
        value: 1
      }]
    ];

    var convertData = function (data) {
      var res = [];
      for (var i = 0; i < data.length; i++) {
        var dataItem = data[i];
        var fromCoord = chinaGeoCoordMap[dataItem[0].name];
        var toCoord = [113.4668, 34.6234];
        if (fromCoord && toCoord) {
          res.push([{
            coord: fromCoord,
            value: dataItem[0].value
          }, {
            coord: toCoord,
          }]);
        }
      }
      return res;
    };
    var series = [];
    [['河南', chinaDatas]].forEach(function (item, i) {
      console.log(item)
      series.push({
            type: 'lines',
            zlevel: 2,
            effect: {
              show: true,
              period: 4, //箭头指向速度，值越小速度越快
              trailLength: 0.02, //特效尾迹长度[0,1]值越大，尾迹越长重
              symbol: 'arrow', //箭头图标
              symbolSize: 5, //图标大小
            },
            lineStyle: {
              normal: {
                width: 1, //尾迹线条宽度
                opacity: 1, //尾迹线条透明度
                curveness: .3, //尾迹线条曲直度
                color: '#FFF000'
              }
            },
            data: convertData(item[1])
          }, {
            type: 'effectScatter',
            coordinateSystem: 'geo',
            zlevel: 2,
            rippleEffect: { //涟漪特效
              period: 4, //动画时间，值越小速度越快
              brushType: 'stroke', //波纹绘制方式 stroke, fill
              scale: 4 //波纹圆环最大限制，值越大波纹越大
            },
            label: {
              normal: {
                show: false,
                position: 'right', //显示位置
                offset: [5, 0], //偏移设置
                formatter: function (params) {//圆环显示文字
                  return params.data.name;
                },
                fontSize: 10
              },
              emphasis: {
                show: true
              }
            },
            symbol: 'none',
            symbolSize: function (val) {
              return 5 + val[2] * 5; //圆环大小
            },
            itemStyle: {
              normal: {
                show: false,
                color: '#fff',
                fontSize: 10
              }
            },
            data: item[1].map(function (dataItem) {
              return {
                name: dataItem[0].name,
                value: chinaGeoCoordMap[dataItem[0].name].concat([dataItem[0].value])
              };
            }),
          },
          //被攻击点
          {
            type: 'scatter',
            coordinateSystem: 'geo',
            zlevel: 2,
            rippleEffect: {
              period: 4,
              brushType: 'stroke',
              scale: 4
            },
            label: {
              normal: {
                show: true,
                position: 'right',
                //offset:[5, 0],
                color: '#fff',
                formatter: '{b}',
                textStyle: {
                  color: "#E15D68",
                  fontWeight: 700
                }
              },
              emphasis: {
                show: true,
                color: "#f60"
              }
            },
            symbol: 'pin',
            color: "#0df1de",
            symbolSize: 20,
            data: [{
              name: item[0],
              value: chinaGeoCoordMap[item[0]].concat([10]),
            }],
          }
      );
    });

    option = {

      geo: {
        map: 'china',
        zoom: 1.2,
        label: {
          emphasis: {
            show: false
          }
        },
        roam: true, //是否允许缩放
        itemStyle: {
          normal: {
            areaColor: {
              type: 'linear',
              x: 0,
              y: 0,
              x2: 0,
              y2: 1,
              colorStops: [{
                offset: 0,
                color: '#0489F0' // 0% 处的颜色
              }, {
                offset: 1,
                color: '#28D8E8' // 100% 处的颜色
              }],
              globalCoord: false // 缺省为 false
            }, //地图背景色
            borderColor: '#516a89', //省市边界线00fcff 516a89
            borderWidth: 1
          },
          emphasis: {
            color: 'rgba(4, 137, 240,1)' //悬浮背景
          }
        },

      },
      series: series
    };

    myChart.setOption(option);

  }

  function myChart2_8_1() {
    var myChart = echarts.init(document.getElementById('chart2-8-1'));
    var myColor = ['#118DF0', '#118DF0', '#118DF0', '#118DF0', '#118DF0'];
    var myColor2 = ['#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF'];
    var datas11 = [34, 41, 52, 69, 72];
    var datas21 = [20, 22, 24, 29, 30];

    function getsum(arr) {
      return arr.reduce(function (prev, curr, idx, arr) {
        return prev + curr;
      });
    }

    var sumarr = datas11.concat(datas21);
    var sum = getsum(sumarr);
    console.log(sum);
    option = {
      grid: [{
        width: "30%",
        left: '15%',
        top: '5%',
        right: '0',
        bottom: '5%'
      },
        {
          width: "30%",
          left: '70%',
          top: '5%',
          right: '0',
          bottom: '5%'
        }
      ],
      xAxis: [{
        gridIndex: 0,
        show: false,
      }, {
        gridIndex: 1,
        show: false,
      }],
      yAxis: [{
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        axisLabel: {
          align: 'left',
          padding: [0, 0, 0, -40],
          textStyle: {
            color: '#fff',
            fontSize: '90%',
            rich: {
              a: {
                fontSize: 12,
                backgroundColor: '#E15D68',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',

              },
              b: {
                fontSize: 12,
                backgroundColor: '#FFAA25',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              c: {
                fontSize: 12,
                backgroundColor: '#14C6CA',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              d: {
                fontSize: 12,
                textAlign: 'center',
                padding: [2, 4],
                color: '#14C6CA',
              }
            }
          },
          formatter: function (params) {
            var data = ['河南', '陕西', '山西', '湖南', '湖北']
            for (var i = 0; i < 5; i++) {
              if (data[i] == params) {
                var j = i + 1
                if (i == 0) {
                  return '{a|' + j + '} ' + params
                }
                if (i == 1) {
                  return '{b|' + j + '} ' + params

                }
                if (i == 2) {
                  return '{c|' + j + '} ' + params
                }
                if (i > 2) {
                  return '{d| ' + j + '}' + params
                }
              }

            }
          },
        },

        data: ['湖北', '湖南', '山西', '陕西', '河南']
      }, {
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        data: []
      },
        {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          axisLabel: {
            align: 'left',
            padding: [0, 0, 0, -50],
            textStyle: {
              color: '#fff',
              fontSize: '90%',
              rich: {
                a: {
                  fontSize: 12,
                  width: 15,
                  textAlign: 'center',
                  color: '#14C6CA',

                }
              },
            },

            formatter: function (params) {
              var data = ['河北', '江苏', '山东', '安徽', '江西'];
              for (var i = 0; i < 5; i++) {
                if (data[i] == params) {
                  var k = i + 6
                  return '{a|' + k + '} ' + params
                }
              }
            },
          },
          data: ['江西', '安徽', '山东', '江苏', '河北']
        }, {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          data: []
        }
      ],
      series: [{
        name: '值',
        type: 'bar',
        xAxisIndex: 0,
        yAxisIndex: 0,
        data: datas11,
        label: {
          normal: {
            show: true,
            position: ['20%', '0'],
            offset: [0, 0],
            color: '#fff',
            fontSize: '12px',
            formatter: function (item) {
              return item.value + '万' + '\xa0\xa0 ' + (item.value / sum * 100).toFixed(2) + '%'
            }
          }
        },
        barWidth: '50%',
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
              offset: 0,
              color: '#0090F8'
            }, {
              offset: 1,
              color: '#00C9FF'
            }]),
            barBorderRadius: 50,
          }
        },
        z: 2
      },


        {
          name: '值',
          type: 'bar',

          xAxisIndex: 1,
          yAxisIndex: 3,
          data: datas21,
          label: {
            normal: {
              show: true,
              position: ['20%', '0'],
              color: '#fff',
              fontSize: '12px',
              formatter: function (item) {
                return item.value + '万' + '\xa0\xa0' + (item.value / sum * 100).toFixed(2) + '%'
              }
            }
          },
          barWidth: '50%',
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                offset: 0,
                color: '#0489F0'
              }, {
                offset: 1,
                color: '#28D8E8'
              }]),
              barBorderRadius: 50,
            }
          },
          z: 2
        },


      ]
    };
    myChart.setOption(option);

  }

  function myChart2_8_2() {
    var myChart = echarts.init(document.getElementById('chart2-8-2'));
    var myColor = ['#118DF0', '#118DF0', '#118DF0', '#118DF0', '#118DF0'];
    var myColor2 = ['#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF'];
    var datas11 = [34, 41, 52, 69, 72];
    var datas21 = [20, 22, 24, 29, 30];

    function getsum(arr) {
      return arr.reduce(function (prev, curr, idx, arr) {
        return prev + curr;
      });
    }

    var sumarr = datas11.concat(datas21);
    var sum = getsum(sumarr);
    console.log(sum);
    option = {
      grid: [{
        width: "30%",
        left: '15%',
        top: '5%',
        right: '0',
        bottom: '5%'
      },
        {
          width: "30%",
          left: '70%',
          top: '5%',
          right: '0',
          bottom: '5%'
        }
      ],
      xAxis: [{
        gridIndex: 0,
        show: false,
      }, {
        gridIndex: 1,
        show: false,
      }],
      yAxis: [{
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        axisLabel: {
          align: 'left',
          padding: [0, 0, 0, -40],
          textStyle: {
            color: '#fff',
            fontSize: '90%',
            rich: {
              a: {
                fontSize: 12,
                backgroundColor: '#E15D68',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',

              },
              b: {
                fontSize: 12,
                backgroundColor: '#FFAA25',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              c: {
                fontSize: 12,
                backgroundColor: '#14C6CA',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              d: {
                fontSize: 12,
                textAlign: 'center',
                padding: [2, 4],
                color: '#14C6CA',
              }
            }
          },
          formatter: function (params) {
            var data = ['郑州', '洛阳', '许昌', '南阳', '安阳']
            for (var i = 0; i < 5; i++) {
              if (data[i] == params) {
                var j = i + 1
                if (i == 0) {
                  return '{a|' + j + '} ' + params
                }
                if (i == 1) {
                  return '{b|' + j + '} ' + params

                }
                if (i == 2) {
                  return '{c|' + j + '} ' + params
                }
                if (i > 2) {
                  return '{d| ' + j + '}' + params
                }
              }

            }
          },
        },

        data: ['安阳', '南阳', '许昌', '洛阳', '郑州']
      }, {
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        data: []
      },
        {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          axisLabel: {
            align: 'left',
            padding: [0, 0, 0, -50],
            textStyle: {
              color: '#fff',
              fontSize: '90%',
              rich: {
                a: {
                  fontSize: 12,
                  width: 15,
                  textAlign: 'center',
                  color: '#14C6CA',

                }
              },
            },

            formatter: function (params) {
              var data = ['焦作', '信阳', '鹤壁', '开封', '周口'];
              for (var i = 0; i < 5; i++) {
                if (data[i] == params) {
                  var k = i + 6
                  return '{a|' + k + '} ' + params
                }
              }
            },
          },
          data: ['周口', '开封', '鹤壁', '信阳', '焦作']
        }, {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          data: []
        }
      ],
      series: [{
        name: '值',
        type: 'bar',
        xAxisIndex: 0,
        yAxisIndex: 0,
        data: datas11,
        label: {
          normal: {
            show: true,
            position: ['20%', '0'],
            offset: [0, 0],
            color: '#fff',
            fontSize: '12px',
            formatter: function (item) {
              return item.value + '万' + '\xa0\xa0 ' + (item.value / sum * 100).toFixed(2) + '%'
            }
          }
        },
        barWidth: '50%',
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
              offset: 0,
              color: '#0090F8'
            }, {
              offset: 1,
              color: '#00C9FF'
            }]),
            barBorderRadius: 50,
          }
        },
        z: 2
      },


        {
          name: '值',
          type: 'bar',

          xAxisIndex: 1,
          yAxisIndex: 3,
          data: datas21,
          label: {
            normal: {
              show: true,
              position: ['20%', '0'],
              color: '#fff',
              fontSize: '12px',
              formatter: function (item) {
                return item.value + '万' + '\xa0\xa0' + (item.value / sum * 100).toFixed(2) + '%'
              }
            }
          },
          barWidth: '50%',
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                offset: 0,
                color: '#0489F0'
              }, {
                offset: 1,
                color: '#28D8E8'
              }]),
              barBorderRadius: 50,
            }
          },
          z: 2
        },


      ]
    };
    myChart.setOption(option);

  }

  function myChart2_8_3() {
    var myChart = echarts.init(document.getElementById('chart2-8-3'));
    var myColor = ['#118DF0', '#118DF0', '#118DF0', '#118DF0', '#118DF0'];
    var myColor2 = ['#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF'];
    var datas11 = [34, 41, 52, 69, 72];
    var datas21 = [20, 22, 24, 29, 30];

    function getsum(arr) {
      return arr.reduce(function (prev, curr, idx, arr) {
        return prev + curr;
      });
    }

    var sumarr = datas11.concat(datas21);
    var sum = getsum(sumarr);
    console.log(sum);
    option = {
      grid: [{
        width: "30%",
        left: '15%',
        top: '5%',
        right: '0',
        bottom: '5%'
      },
        {
          width: "30%",
          left: '70%',
          top: '5%',
          right: '0',
          bottom: '5%'
        }
      ],
      xAxis: [{
        gridIndex: 0,
        show: false,
      }, {
        gridIndex: 1,
        show: false,
      }],
      yAxis: [{
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        axisLabel: {
          align: 'left',
          padding: [0, 0, 0, -40],
          textStyle: {
            color: '#fff',
            fontSize: '90%',
            rich: {
              a: {
                fontSize: 12,
                backgroundColor: '#E15D68',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',

              },
              b: {
                fontSize: 12,
                backgroundColor: '#FFAA25',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              c: {
                fontSize: 12,
                backgroundColor: '#14C6CA',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              d: {
                fontSize: 12,
                textAlign: 'center',
                padding: [2, 4],
                color: '#14C6CA',
              }
            }
          },
          formatter: function (params) {
            var data = ['河南', '陕西', '山西', '湖南', '湖北']
            for (var i = 0; i < 5; i++) {
              if (data[i] == params) {
                var j = i + 1
                if (i == 0) {
                  return '{a|' + j + '} ' + params
                }
                if (i == 1) {
                  return '{b|' + j + '} ' + params

                }
                if (i == 2) {
                  return '{c|' + j + '} ' + params
                }
                if (i > 2) {
                  return '{d| ' + j + '}' + params
                }
              }

            }
          },
        },

        data: ['湖北', '湖南', '山西', '陕西', '河南']
      }, {
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        data: []
      },
        {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          axisLabel: {
            align: 'left',
            padding: [0, 0, 0, -50],
            textStyle: {
              color: '#fff',
              fontSize: '90%',
              rich: {
                a: {
                  fontSize: 12,
                  width: 15,
                  textAlign: 'center',
                  color: '#14C6CA',

                }
              },
            },

            formatter: function (params) {
              var data = ['河北', '江苏', '山东', '安徽', '江西'];
              for (var i = 0; i < 5; i++) {
                if (data[i] == params) {
                  var k = i + 6
                  return '{a|' + k + '} ' + params
                }
              }
            },
          },
          data: ['江西', '安徽', '山东', '江苏', '河北']
        }, {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          data: []
        }
      ],
      series: [{
        name: '值',
        type: 'bar',
        xAxisIndex: 0,
        yAxisIndex: 0,
        data: datas11,
        label: {
          normal: {
            show: true,
            position: ['20%', '0'],
            offset: [0, 0],
            color: '#fff',
            fontSize: '12px',
            formatter: function (item) {
              return item.value + '万' + '\xa0\xa0 ' + (item.value / sum * 100).toFixed(2) + '%'
            }
          }
        },
        barWidth: '50%',
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
              offset: 0,
              color: '#0090F8'
            }, {
              offset: 1,
              color: '#00C9FF'
            }]),
            barBorderRadius: 50,
          }
        },
        z: 2
      },


        {
          name: '值',
          type: 'bar',

          xAxisIndex: 1,
          yAxisIndex: 3,
          data: datas21,
          label: {
            normal: {
              show: true,
              position: ['20%', '0'],
              color: '#fff',
              fontSize: '12px',
              formatter: function (item) {
                return item.value + '万' + '\xa0\xa0' + (item.value / sum * 100).toFixed(2) + '%'
              }
            }
          },
          barWidth: '50%',
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                offset: 0,
                color: '#0489F0'
              }, {
                offset: 1,
                color: '#28D8E8'
              }]),
              barBorderRadius: 50,
            }
          },
          z: 2
        },


      ]
    };
    myChart.setOption(option);

  }

  function myChart2_8_4() {
    var myChart = echarts.init(document.getElementById('chart2-8-4'));
    var myColor = ['#118DF0', '#118DF0', '#118DF0', '#118DF0', '#118DF0'];
    var myColor2 = ['#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF', '#00FFFF'];
    var datas11 = [34, 41, 52, 59, 72];
    var datas21 = [20, 22, 26, 29, 30];

    function getsum(arr) {
      return arr.reduce(function (prev, curr, idx, arr) {
        return prev + curr;
      });
    }

    var sumarr = datas11.concat(datas21);
    var sum = getsum(sumarr);
    console.log(sum);
    option = {
      grid: [{
        width: "30%",
        left: '15%',
        top: '5%',
        right: '0',
        bottom: '5%'
      },
        {
          width: "30%",
          left: '70%',
          top: '5%',
          right: '0',
          bottom: '5%'
        }
      ],
      xAxis: [{
        gridIndex: 0,
        show: false,
      }, {
        gridIndex: 1,
        show: false,
      }],
      yAxis: [{
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        axisLabel: {
          align: 'left',
          padding: [0, 0, 0, -40],
          textStyle: {
            color: '#fff',
            fontSize: '90%',
            rich: {
              a: {
                fontSize: 12,
                backgroundColor: '#E15D68',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',

              },
              b: {
                fontSize: 12,
                backgroundColor: '#FFAA25',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              c: {
                fontSize: 12,
                backgroundColor: '#14C6CA',
                borderRadius: 10,
                padding: [2, 5],
                textAlign: 'center',
                color: '#fff',
              },
              d: {
                fontSize: 12,
                textAlign: 'center',
                padding: [2, 4],
                color: '#14C6CA',
              }
            }
          },
          formatter: function (params) {
            var data = ['河南', '陕西', '山西', '湖南', '湖北']
            for (var i = 0; i < 5; i++) {
              if (data[i] == params) {
                var j = i + 1
                if (i == 0) {
                  return '{a|' + j + '} ' + params
                }
                if (i == 1) {
                  return '{b|' + j + '} ' + params

                }
                if (i == 2) {
                  return '{c|' + j + '} ' + params
                }
                if (i > 2) {
                  return '{d| ' + j + '}' + params
                }
              }

            }
          },
        },

        data: ['湖北', '湖南', '山西', '陕西', '河南']
      }, {
        gridIndex: 0,
        splitLine: 'none',
        axisTick: 'none',
        axisLine: 'none',
        data: []
      },
        {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          axisLabel: {
            align: 'left',
            padding: [0, 0, 0, -50],
            textStyle: {
              color: '#fff',
              fontSize: '90%',
              rich: {
                a: {
                  fontSize: 12,
                  width: 15,
                  textAlign: 'center',
                  color: '#14C6CA',

                }
              },
            },

            formatter: function (params) {
              var data = ['河北', '江苏', '山东', '安徽', '江西'];
              for (var i = 0; i < 5; i++) {
                if (data[i] == params) {
                  var k = i + 6
                  return '{a|' + k + '} ' + params
                }
              }
            },
          },
          data: ['江西', '安徽', '山东', '江苏', '河北']
        }, {
          gridIndex: 1,
          splitLine: 'none',
          axisTick: 'none',
          axisLine: 'none',
          data: []
        }
      ],
      series: [{
        name: '值',
        type: 'bar',
        xAxisIndex: 0,
        yAxisIndex: 0,
        data: datas11,
        label: {
          normal: {
            show: true,
            position: ['20%', '0'],
            offset: [0, 0],
            color: '#fff',
            fontSize: '12px',
            formatter: function (item) {
              return item.value + '万' + '\xa0\xa0 ' + (item.value / sum * 100).toFixed(2) + '%'
            }
          }
        },
        barWidth: '50%',
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
              offset: 0,
              color: '#0090F8'
            }, {
              offset: 1,
              color: '#00C9FF'
            }]),
            barBorderRadius: 50,
          }
        },
        z: 2
      },


        {
          name: '值',
          type: 'bar',

          xAxisIndex: 1,
          yAxisIndex: 3,
          data: datas21,
          label: {
            normal: {
              show: true,
              position: ['20%', '0'],
              color: '#fff',
              fontSize: '12px',
              formatter: function (item) {
                return item.value + '万' + '\xa0\xa0' + (item.value / sum * 100).toFixed(2) + '%'
              }
            }
          },
          barWidth: '50%',
          itemStyle: {
            normal: {
              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                offset: 0,
                color: '#0489F0'
              }, {
                offset: 1,
                color: '#28D8E8'
              }]),
              barBorderRadius: 50,
            }
          },
          z: 2
        },


      ]
    };
    myChart.setOption(option);

  }

  myChart2_1_1()
  myChart2_1_2()
  myChart2_1_3()
  myChart2_2_1()
  myChart2_2_2()
  myChart2_2_3()
  myChart2_3()
  myChart2_4_1()
  myChart2_4_2()
  myChart2_4_3()
  myChart2_5_1()
  myChart2_5_2()
  myChart2_5_3()
  myChart2_6()
  myChart2_7()
  myChart2_8_1()
  myChart2_8_2()
  myChart2_8_3()
  myChart2_8_4()


  // 游客量
  $('.change-box li').click(function () {
    $(this).addClass('active').siblings('li').removeClass('active')
    let index = $(this).index()
    $(this).parents('.change-box').siblings('.visitor-number-chart').children().eq(index).removeClass('chart-hd').siblings().addClass('chart-hd')
  })
  // 客源
  $('.tourists-box a').click(function () {
    $(this).addClass('active').siblings('a').removeClass('active')
    let index = $(this).index()
    $(this).parents('.title-box').siblings('.center-chart-box').children().eq(index).removeClass('chart-hd').siblings().addClass('chart-hd')
  })


  // 下拉框
  // 对所有下拉款进行初始化

  $(".sheng").M_select({
    // 手动添加下拉款图片（以html页面为起始位置写路径）
    "Img": "../../plugin/M_select/js/M_select/up4.png",
    "Img2": "../../plugin/M_select/js/M_select/down4.png",
    "radius": "4px",
    "Title": "选择省份",
    "inputName": "selected_value",
    // 默认选中的值（参数值写需要选中的select的value值）
    "selected": "03",
    Succee: function () {
      site = $('#select-sheng').val()
      console.log(site)
    }
  });
  $(".shi").M_select({
    // 手动添加下拉款图片（以html页面为起始位置写路径）
    "Img": "../../plugin/M_select/js/M_select/up4.png",
    "Img2": "../../plugin/M_select/js/M_select/down4.png",
    "radius": "4px",
    "Title": "选择城市",
    "inputName": "selected_value",
    // 默认选中的值（参数值写需要选中的select的value值）
    "selected": "03",
    Succee: function () {
      site = $('#select-shi').val()
      console.log(site)
    }
  });
  $(".jingqu").M_select({
    // 手动添加下拉款图片（以html页面为起始位置写路径）
    "Img": "../../plugin/M_select/js/M_select/up4.png",
    "Img2": "../../plugin/M_select/js/M_select/down4.png",
    "radius": "4px",
    "Title": "选择景区",
    "inputName": "selected_value",
    // 默认选中的值（参数值写需要选中的select的value值）
    "selected": "03",
    Succee: function () {
      site = $('#select-jingqu').val()
      console.log(site)
    }
  });
})
